Hi ha dos tipus de selectors elementals en CSS :
És simplement un asterisc. El selector universal el que fa és seleccionar-ho tot. S'ha d'utilizar amb molt de compte i només s'utilitza en certs casos molt concrets. Més endavant, quan us ensenyi el box model o el box sizing, aquest selector s'utilitza per un parell d'elements concrets.
* {
background-color: lightcoral;
}
Un pràctica ABSOLUTAMENT QUE HEU D'EVITAR és la següent:
* {
margin: 0;
background-color: lightcoral;
}
És simplement posar el nombre de l'etiqueta que volem donar estil.
h1 {
background-color: lightcyan;
}
Si volem canviar TOTES les etiquetes <p> posariem el següent
p {
background-color: lightgreen;
}
Aquests selector s'aplica en el reset d'estils que es fa servir per començar una pàgina web. Algunes etiquetes com h1 o p per exemple porten uns estils associats per defecte. Aquests estils es poden resetejar.
Per exemple, l'etiqueta h1 porta aquests estils associats:
h1 {
display: block;
font-size: 2em;
margin-top: 0.67em;
margin-bottom: 0.67em;
margin-left: 0;
margin-right: 0;
font-weight: bold;
}
La majoria d'aquests estils no els coneixem encara, però resetejar o normalitzar els estils de h1 voldria dir treure aquestes propietats associades a <h1>. El reset o la normalització d'estils es fa a totes les etiquetes. Ho veurem més endavant.
Podem donar estils a moltes altres etiquetes, com per exemple, a <ul> o a <li> i tants d'altres. En general, aquests selectors s'utilitzen en comptades ocasions. Els que més s'utilitzen són els selectors de classe.
En la documentació de W3Schools teniu més informació sobre els selectors de CSS.